<template>
	<view>
		<view v-for="(item, index) in news" :key="item.nID" style="margin: 10rpx;" class="news-item">
			<CardViewText 
				:title="item.title"
				:isTop="item.isTop"
				:author="item.author"
				:comments="item.comments"
				:timedata="item.timedata"
				:image="item.image"
				:mode="item.mode ||2"
				@click="onCardClick(item.nID)"
			>
				<template v-slot:tips v-if="item.showSearch">
					<view class="slotcontent">
						<text>搜索</text>
						<view class="borderbox"><text>今日金价</text></view>
						<view class="borderbox"><text>精选好物</text></view>
					</view>
				</template>
				
			</CardViewText>
		</view>
	</view>
</template>

<script>
import CardViewText from "/components/CardViewText.vue"
import xinwen from "/Data/news.json"
export default {
	components: {
		CardViewText,
		xinwen
	},
	data() {
		return {
			news:null,
		}
	},
	onShow(){
		this.news = xinwen.datalist;
	},
	onLoad(){
		console.log("page onLoad--->"+this.news);
	},
	methods: {
		onCardClick(nid) {
			console.log('点击了新闻:', nid);
		}
	}
}
</script>

<style>
.slotcontent {
	display: flex;
	align-items: center;
	margin-top: 10rpx;
	gap: 12rpx;
}

.borderbox {
	padding: 4rpx 12rpx;
	border: 1rpx solid #e0e0e0;
	border-radius: 6rpx;
}
</style>